import React, { FC } from 'react'
import dayjs from 'dayjs'
import PostType from '@/types/post'

export type PostProps = {
  post: PostType
}

const Post: FC<PostProps> = ({ post }) => {
  const { title, author, titleImage, imageDescription, content, date } = post
  return (
    <article className="flex flex-col flex-wrap space-y-4">
      <h3 className="text-2xl font-bold">{title}</h3>
      <p>{author}</p>
      {titleImage && (
        <img src={titleImage} alt={title} className="object-cover"></img>
      )}
      {imageDescription && (
        <p
          className=" text-center text-gray-400"
          dangerouslySetInnerHTML={{ __html: imageDescription }}
        ></p>
      )}
      <section
        className="prose max-w-full"
        dangerouslySetInnerHTML={{ __html: content }}
      ></section>
      <p>{dayjs(date).format('YYYY-MM-DD')}</p>
    </article>
  )
}

export default Post
